<template>
    <div>
        <el-row style="margin: 10px 0">
            <el-col :span="8" style="text-align: right;margin-right: 10px">
                <span>姓名:</span>
            </el-col>
            <el-col :span="8" style="text-align: left">
                <span>{{userName}}</span>
            </el-col>
        </el-row>
        <el-row style="margin: 10px 0">
            <el-col :span="8" style="text-align: right;margin-right: 10px">
                <span>基本工资:</span>
            </el-col>
            <el-col :span="8" style="text-align: left">
                <span>{{BaseSalary}}</span>
                <span>元</span>
            </el-col>
        </el-row>
        <el-row style="margin: 10px 0">
            <el-col :span="8" style="text-align: right;margin-right: 10px">
                <span>奖金:</span>
            </el-col>
            <el-col :span="8" style="text-align: left">
                <span>{{Bonus}}</span>
                <span>元</span>
            </el-col>
        </el-row>
        <el-row style="margin: 10px 0">
            <el-col :span="8" style="text-align: right;margin-right: 10px">
                <span>应扣:</span>
            </el-col>
            <el-col :span="8" style="text-align: left">
                <span>{{Deduction}}</span>
                <span>元</span>
            </el-col>
        </el-row>
        <el-row style="margin: 10px 0">
            <el-col :span="8" style="text-align: right;margin-right: 10px">
                <span>总计:</span>
            </el-col>
            <el-col :span="8" style="text-align: left">
                <span>{{count}}</span>
                <span>元</span>
            </el-col>
        </el-row>


    </div>
</template>

<script>
    import {mapActions} from 'vuex'

    export default {
        name: "checkSalary",
        computed: {
            count() {
                return parseInt(this.$store.state.workPageStore.BaseSalary)
                    + parseInt(this.$store.state.workPageStore.Bonus) - parseInt(this.$store.state.workPageStore.Deduction)
            },
            BaseSalary(){
                return this.$store.state.workPageStore.BaseSalary
            },
            Bonus(){
                return this.$store.state.workPageStore.Bonus
            },
            Deduction(){
                return this.$store.state.workPageStore.Deduction
            },
            userName(){
              return  this.$store.state.user.userName
            },
        },
        data() {
            return {

            }

        },
        created() {
            this.ckeckSalaryInfo();
        },
        methods: {
            ...mapActions(['ckeckSalaryInfoAct']),
            ckeckSalaryInfo() {
                let obj = {
                    staffId :this.$store.state.user.userId
                    // staffId: 1
                }
                this.ckeckSalaryInfoAct(obj)
            },
        },
    }
</script>

<style scoped>

</style>